<!--
  Generated template for the MessagePage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar text-center>
    <ion-title>客户管理</ion-title>
    <ion-buttons end>
      <button ion-button icon-only (click)="addItem()">
        <ion-icon name="add"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content pullingIcon="arrow-dropdown" pullingText="刷新"
                           refreshingSpinner="circles" refreshingText="正在加载，请稍后...">
    </ion-refresher-content>
  </ion-refresher>

  <ion-card>
    <ion-card-header>
      查询
    </ion-card-header>
    <ion-card-content>
      <ion-list>
        <ion-item>
          <ion-label>姓名</ion-label>
          <ion-input type="text" [(ngModel)]="customersParas.name"></ion-input>
        </ion-item>
        <ion-item>
          <ion-label>电话</ion-label>
          <ion-input type="number" [(ngModel)]="customersParas.phone"></ion-input>
        </ion-item>
        <ion-item>
          <ion-label>查询开始时间</ion-label>
          <ion-datetime displayFormat="YYYY-MM-DD" cancelText="取消" doneText="确定" [(ngModel)]="customersParas.bcreatetime"></ion-datetime>
        </ion-item>
        <ion-item>
          <ion-label>查询结束时间</ion-label>
          <ion-datetime displayFormat="YYYY-MM-DD" cancelText="取消" doneText="确定" [(ngModel)]="customersParas.ecreatetime"></ion-datetime>
        </ion-item>
      </ion-list>
      <div padding>
        <button ion-button color="primary" (click)="loadData()" block>查询</button>
      </div>
    </ion-card-content>
  </ion-card>

  <ion-list>
    <ion-item-sliding *ngFor="let item of customers">
      <ion-item (click)="consumeList(item)">
        <h3>{{ item.name }}[{{item.phone}}]</h3>
        <ion-icon name="ios-arrow-forward" item-end></ion-icon>
      </ion-item>
      <ion-item-options side="right">
        <button ion-button color="primary" (click)="updateItem(item)">
          <ion-icon name="create"></ion-icon>
          编辑
        </button>
        <button ion-button color="secondary" (click)="moreItem(item)">
          <ion-icon name="more"></ion-icon>
          详细
        </button>
        <button ion-button color="danger" (click)="deleteItem(item)">
          <ion-icon name="trash"></ion-icon>
          删除
        </button>
      </ion-item-options>
    </ion-item-sliding>
  </ion-list>


  <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content
      loadingSpinner="bubbles"
      loadingText="正在加载，请稍后...">
    </ion-infinite-scroll-content>
  </ion-infinite-scroll>
</ion-content>
